<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>商家订单分润详情</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <script src="/houtai/js/vue.js"></script>
    <script type="text/javascript" src="/houtai/js/jquery-2.1.4.js"></script>

    <link rel="stylesheet" href="/houtai/layuiadmin/layui/css/layui.css"  media="all">
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
    <!--设置layUI表格样式，自动换行-->
    <style>
        .layui-table-cell{
            height:35px;
            line-height: 35px;
        }
    </style>
</head>
<body>

<!--------------------------------------头部工具条------------------------------------------>
<script type="text/html" id="headbar">
    <div class="layui-btn-container"  >
        <button class="layui-btn layui-btn-warm" lay-event="getCheckData">返回

        </button>
    </div>
</script>

<!-------------------------------------------- 每一行工具条 --------------------------------------->
<script type="text/html" id="barDemo">

    <button type="button" class="layui-btn layui-btn-xs layui-btn-radius layui-btn-warm" lay-event="singleUpdate">
        <i class="layui-icon">&#xe642;</i>结算
    </button>
</script>

<!---------------------------------------------条件搜索框------------------------------------------->
<div class="demoTable" style="margin-top: 10px">
    <form id="serachForm" class="layui-form">

        <div class="layui-inline" >

                <label class="layui-form-label">分润状态</label>
                <div class="layui-input-block">
                    <select name="isSettlement" id="isSettlement" lay-filter="aihao">
                        <option value="" selected>全部</option>
                        <option value="1" >已分润</option>
                        <option value="0">未分润</option>
                    </select>
                </div>

        </div>

        <div class="layui-inline">
            <label class="layui-form-label">结算时间</label>
            <div class="layui-input-inline" style="width: 100px">
                <input type="text" name="startDate" id="startDate" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
            </div>
            -
            <div class="layui-input-inline" style="width: 100px">
                <input type="text" name="endDate" id="endDate" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline" style="margin-left: 10px">
            <!--这个地方的不能直接使用button标签，使用button标签会重复提交数据-->
            <input type="button" class="layui-btn" data-type="reload" value="搜索">
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>

    </form>
</div>

<!-----------------------------------------表格内容--------------------------------------------->
<div id="content">
    <table class="layui-table"
           lay-data="{url:'/houtai/page/finance/queryForAdmin',page:true,limit:5,limits:[5,10],toolbar:'#headbar',
                     height:'full-100',loading:true,title:'商家订单分润详情表',
                     //把返回的数据result转为换layUI需要的格式，此处返回的是mybatisPlus的IPage对象，具体返回值自己设定
                     parseData: function(res){ //res 即为原始返回的数据
                     console.log(res);
                        return {
                            'code': res.code, //解析接口状态
                            'msg': res.message, //解析提示文本
                            'count': res.obj.totalSize, //解析数据长度
                            'data': res.li //解析数据列表
                          };
                       },
                //给表格设置一个ID
               id:'test'}"
           lay-filter="filter">
        <thead>
        <tr>
            <!--开起全选框-->
            <th lay-data="{checkbox:true,fixed:'left'}"></th>
            <th lay-data="{field:'myorderShareId',hide:true}">分润ID</th>
            <th lay-data="{field:'myorderNumber',totalRowText:'合计'}">订单编号</th>
            <th lay-data="{field:'myorderId',hide:true}">子订单ID</th>

            <th lay-data="{field:'businessId',hide:true}">商家ID</th>
            <th lay-data="{field:'businessName',width:200}">商家名称</th>
            <th lay-data="{field:'myorderTotalPrice',totalRow:true,templet:function(d){
                return Number(d.myorderTotalPrice).toFixed(2);
            }}">金额</th>
            <th lay-data="{field:'myorderShareStatus',sort: true,
                templet:'#myorderShareStatus'}"
                >分润状态</th>
            <th lay-data="{field:'myorderShareTime'}">结算时间</th>

            <th lay-data="{field:'remark',hide:true}">备注</th>
            <!--最后一列操作列，有修改或删除的权限就显示这列，否者不显示，通过Vue实现-->
            <th  lay-data="{field:'opeartion', width:170,fixed: 'right', toolbar: '#barDemo'}">操作</th>
        </tr>
        </thead>
    </table>
</div>
 <script type="text/html" id="myorderShareStatus">
                  {{#  if(d.myorderShareStatus === 1){ }}
                     <span class="layui-badge layui-bg-green">已分润</span>
                  {{#  } else { }}
                   <span class="layui-badge">未分润</span>
                  {{#  } }}
</script>


<script src="/houtai/layuiadmin/layui/layui.js" charset="utf-8"></script>
<script src="/houtai/layuiadmin/layui/lay/modules/util.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>


    layui.use(['table','jquery','laypage','util','laydate','form','layer'], function(){
        var table = layui.table;
        var $ = layui.jquery;
        var util = layui.util;
        var laydate = layui.laydate;
        var form = layui.form;
        var layer = layui.layer;



        //加载日期选择插件
        laydate.render({
            elem: '#startDate'
        });
        laydate.render({
            elem: '#endDate'
        });
        //刷新表单
        form.render();
        //监听顶部工具栏事件
        table.on('toolbar(filter)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            var data = checkStatus.data;

            switch(obj.event){

                case 'getCheckData':
                    location.href="/houtai/page/finance/myordershare.html";
                    break;
            }

        });

        //监听每一行工具条
        table.on('tool(filter)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            console.log(data);
            if(layEvent === 'detail'){//查看
                //do somehing
            }  else if(layEvent === 'singleUpdate'){ //编辑
                if(data.myorderShareStatus==1){
                    layer.msg("已结算", {icon: 5});
                }else {
                    layer.confirm('确认结算', function(index) {
                        layer.close(index);
                        $.ajax({
                            url: "/houtai/page/finance/updateByMyorderShareId",
                            data: {myorderShareId: data.myorderShareId},
                            type: "post",
                            dataType: "json",
                            success: function (data) {
                                if (data.message == "success") {
                                    layer.msg("结算成功", {icon: 6});
                                    //重载表格
                                    window.location.reload();
                                } else if (data.message == "premissionException") {
                                    location.href = "/houtai/page/exception/NoPremission.html";
                                } else if (data.message == "serverException") {
                                    location.href = "/houtai/page/exception/500.html";
                                } else {
                                    layer.msg("结算失败", {icon: 5});
                                }
                            }
                        });
                    });
                }
            }
        });

        //监听表单提交，上述的submit()中的值为事件过滤器的值
        form.on('submit(updateSubmit)', function(data){
            console.log(data.field.commentAnswer) //当前容器的全部表单字段，名值对形式：{name: value}
            if(data.field.commentAnswer != null || data.field.commentAnswer.trim() != ''){
                $.ajax({
                    url:"/houtai/page/products/comment/update",
                    data:{commentId:data.field.commentId,commentAnswer:data.field.commentAnswer},
                    type:"post",
                    dataType:"json",
                    success:function (data) {
                        if(data.message == "success"){
                            //关闭弹出层
                            layer.closeAll();
                            layer.msg("回复成功");
                            //重载表格
                            $(".layui-laypage-btn").click();
                        }else if(data.message == "premissionException"){
                            location.href = "/houtai/page/exception/NoPremission.html";
                        }else if(data.message == "serverException"){
                            location.href = "/houtai/page/exception/500.html";
                        }else{
                            layer.msg("删除失败", {icon: 5});
                        }
                    }
                })
            }
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });


        //设置搜索框查询条件
        var $ = layui.$, active = {
            reload: function(){
                var demoReload = $('#demoReload');
                var str = $("#serachForm").serialize();
                //执行重载
                table.reload('test', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    ,where: {
                        businessId:$("#businessId").val(),
                        businessName:$("#businessName").val(),
                        isSettlement:$("#isSettlement").val(),
                        startDate:$("#startDate").val(),
                        endDate:$("#endDate").val()
                    }
                }, 'data');
            }
        };

        //监听搜索框提交按钮
        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });

        //监听修改框提交
        form.on('submit(formDemo)', function(data){
            layer.msg(JSON.stringify(data.field));
            return false;
        });
    });
</script>

</body>
</html>